*{
  text-decoration:none;
  color:black;
  padding:0px;
  list-style-type:none;
  margin:0px;

}
.clear
{
	clear:both;
}
body 
{
  background-color :#EAFAF1;
}

/*BUTON */

.active {
  background-color: #4CAF50;
} 
   @keyframes hareketsagsol{
            from{ right:-700px; opacity:0.5;}to{right:0px; opacity:1;}
        }
    @keyframes hareketsagsol2{
            from{ right:0px;opacity:1;}to{right:700px;opacity:0.5;}
        }
    #slider{
        margin-left:25px;
        width:50%;
        height:400px;
        overflow:hidden;
        position:relative;
        border:1px solid green;
        float:left;
        }
    .slayt{
        width:700px;
        height:400px;
        overflow:hidden;
        position:absolute;
        top:0;
        right:-700px;
        opacity:0.5;
        }
    .ileri,.geri{
        width:30px;
        height:30px;
        line-height:30px;
        background-color:rgba(153,153,153,0.5);
        text-align:center;
        font-weight:600;
        position:absolute;
        top:45%;
        cursor:pointer;
        }
    .aciklama{
        width:100%;
        height:auto;
        padding:10px;
        color:white;
        opacity:0.4;
        background-color:rgba(0,0,0,0.4);
        position:absolute;
        bottom:0;
        }
    .slaytsirasi ul{ 
      list-style:
       none; 
       padding:0; 
       margin:0;}
    .slaytsirasi ul li{ display:inline-block; padding:0.5em; background-color:rgba(255,255,255,0.5); border-radius:50%; transition:all .5s linear}
    .slaytsirasi ul li:hover{ background-color:rgba(242, 17, 17, 0.85);}
    .aktifLi{ 
      background-color:rgba(242, 17, 17, 1) !important;
    }
    .slaytsirasi{ position: absolute; 
      bottom:2px;
      left:5px;}

   body {
  font-family: Arial, Helvetica, sans-serif;
}

.flip-box {
  
  width: 96%;
  height: 200px;
   
  perspective: 1000px;
  margin-left:25px;
  margin-top:9px;
  display:flex;
  
}

.flip-box-inner {
  position: relative;
  width: 300px;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
  margin:5px;

}

.flip-box-inner:hover  {
  transform: rotateY(180deg);
  
}

.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  
}

.flip-box-front img{
	width:200px;
	height:200px; 
}
 
.flip-box-back {
  background-color: #555;
  display:flex;
  flex-direction:column;
  justify-content:center;
  transform:rotateY(180deg);
}
.flip-box-back h2,.flip-box-back p
{
  color: white;

}
   
.h2
{
    margin:30px; 
     
}
.wepanketim
{
  margin-left:40px;
}   
   
.button {
  background-color: #4CAF50;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  
}
.button {
  background-color: green;
  border: none;
  color: black;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  align:center;
  margin:3px 11px;
}
.button a
{
  color: white;
}
.cozum
{
  display:flex;
  flex-direction:column;
  justify-content:center;
    width:40%;
        height:400px;

}
   
    
   .cozumbtn
   {
      display:flex;
      flex-direction:row;
    justify-content:center;
    padding:15px;

   }